<template>
	<view>
		<view class="botSellPay">
			<view class="totalNum">
				<view class="hj">共计:</view>
				<view class="totalTxt">
					<view>
						<text class="unit">¥</text>
						<text class="priceNum">{{actMoney}}</text>
					</view>
				</view>
			</view>
			<view class="confirmBtn" @tap="goPay">{{btnTit}}</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			actMoney:Number,
			btnTit:String
		},
		methods:{
			goPay(){
				this.$emit('goPay');
			}
		}
	}
</script>

<style scoped lang="scss">
	.botSellPay{
		width: 100%;
		@include respTo(phone){
			height: 100rpx;
		}
		@include respTo(pad){
			height: 70rpx;
		}
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 20;
		box-shadow: 0 -3rpx 5rpx rgba(0,0,0,.05);
		.totalNum{
			width: 60%;
			height: 100%;
			display: flex;
			align-items: center;
			.hj{
				margin:0 15rpx 0 30rpx;
				color: $pss-text-color3;
				@include respTo(phone){
					font-size: $font-size28;
				}
				@include respTo(pad){
					font-size: $padSize18;
				}
			}
			.totalTxt{
				color: $pss-color-red; 
				display: flex;
				flex-direction: column;
			}
			.totalTxt .unit{
				font-weight: bold;
				margin-right: 5rpx;
				@include respTo(phone){
					font-size: $font-size24;
				}
				@include respTo(pad){
					font-size: $padSize16;
				}
			}
			.totalTxt .priceNum{
				font-weight: bold;
				@include respTo(phone){
					font-size:40rpx;
				}
				@include respTo(pad){
					font-size: 28rpx;
				}
			}
		}
		.confirmBtn{
			width: 300rpx;
			height: 100%;
			background:$pss-color-primary_1;
			color:#fff;
			text-align: center;
			padding: 0 20rpx;
			@include respTo(phone){
				font-size: $font-size32;
				line-height: 100rpx;
			}
			@include respTo(pad){
				font-size: $padSize22;
				line-height: 70rpx;
			}
		}
	}
</style>